<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <style>
        
    </style>
</head>
<body>
    用户名：<input type="text" id="username"><br>
    密码：<input type="text" id="password"><br>
    <input id="remeber" type="checkbox">记住账号密码
    <input type="button" value="登录" id="login">
</body>
<script>

    class Login{
        constructor(){
            this.un = document.querySelector("#username");
            this.pw = document.querySelector("#password");
            this.rmb = document.querySelector("#remeber");
            this.login = document.querySelector("#login");

            this.init();
            this.addEvent();
        }
        addEvent(){
            const that = this;
            this.login.onclick = function(){
                if(that.rmb.checked){
                    that.setLocal();
                }
            }
        }
        setLocal(){
            localStorage.setItem("username", this.un.value);
            localStorage.setItem("passwrod", this.pw.value);
        }
        init(){
            this.un.value = localStorage.getItem("username") || "";
            this.pw.value = localStorage.getItem("passwrod") || "";
        }
    }

    new Login;
    
</script>
</html>